[Música]
Hola, buenas tardes.
El tema de hoy es la accesibilidad digital en las imágenes.
Espero que sea un tema que les interese.
Y cuando hablamos de imágenes digitales,
tenemos que pensar en imágenes que estén diseñadas y optimizadas
para garantizar la igualdad de acceso y de interpretación
por todas las personas.
En este sentido, vamos a trabajar hoy sobre estos parámetros
de texto alternativo, contraste de color,
evitar la dependencia del color, la información redundante
y, si es posible, hacer un testeo con alguna tecnología asistiva.
Todos conocemos lo que son los textos alternativos.
Son aquellos textos que se ponen para que los lectores de pantalla,
cuando pasen por una imagen,
lean en voz alta a las personas con discapacidades visuales
y puedan interpretar estas imágenes.
¿Cuándo se pone el texto alternativo?
Se pone cuando este es significativo.
No es necesario poner texto alternativo
cuando una imagen es decorativa.
Por eso estos software y estos editores de texto
o estos programas editores de contenidos traen
marcar como texto alternativo como opción para esta función.
De manera tal que, cuando pasa el lector de pantalla, lee:
imagen, texto decorativo.
Y ya la persona sabe que esa imagen no es relevante
para interpretar el texto que viene leyendo.
Entonces, estos recursos los vamos a encontrar
en todos los editores de textos y también en redes sociales
y en todas las plataformas con las que trabajamos digitalmente
porque ya vienen seteados los parámetros
de todos estos espacios digitales.
Por ejemplo, aquí mismo, esto es un Moodle.
Miren que cuando subimos una foto,
también nos permite describir allí la imagen.
En este caso, creo que no sería necesaria la descripción,
pero está la posibilidad.
Y si no ponemos, la descripción no es necesaria.
Bien, ¿cuándo ponemos entonces descripción?
Cuando estas imágenes son significativas.
Este podría ser un caso, ¿no?
Donde nos está dando información esta imagen que hizo el diseñador.
Nos está diciendo la cantidad de personas con discapacidad
que hay en el mundo.
Entonces, tal y como la imagen dice,
reescribimos ese texto en el texto alternativo
de manera que el lector de pantalla, cuando pase por la imagen,
lea en altavoz el sentido de la imagen que está ahí compartida.
¿Qué pasa con este paréntesis?
Este paréntesis es porque muchas veces nos encontramos
en los recursos, en los contenidos, con imágenes complejas
que, precisamente, no debería estar en imagen,
deberían estar realizadas de otra manera.
Pero sí aparecen como imagen.
Entonces, esta complejidad de las imágenes tiene que estar
en texto alternativo o tiene que estar descrita
en texto de párrafo como veremos más adelante.
De manera tal que las personas puedan interpretar
qué es el contenido y la información que allí está.
Quiero decir, entonces, que los programas de edición de texto
o de edición para realizar presentaciones,
traen en sus materiales de realización de recursos
montón de posibilidades, como la generación de tablas.
Si yo utilizo estas propiedades del sistema,
me garantiza que el lector de pantalla
va a interpretar este recurso.
Cuando el lector de pantalla pasa por aquí, dirá: tabla,
encabezado 1, encabezado dos... y va a leer
cada celda y la persona va a poder interpretar.
Si yo pongo una imagen, se complejiza más
y voy a tener un texto alternativo mucho más complejo también.
¿Qué pasa con el contraste de color?
Muy importante también.
Si yo, como vemos aquí, en esta imagen compleja
donde la fotografía tiene casi un monocromo
y tiene mucha información, el texto se pierde.
Y se pierde no solo por el bajo contraste que hay entre ellas,
sino también por el tamaño tipográfico que aporta.
Es una cuestión más que tenemos que tener en cuenta
a la hora de realizar imágenes para compartir digitalmente.
En ese sentido, ¿cómo verifico yo el contraste?
Bueno, lo hago a través de los ratios de contraste suficientes
para identificar la figura y el fondo.
¿Y qué es esto?
El ratio de contraste es esta diferencia de luz
que hay entre dos colores y se mide en una escala de 1 a 21.
Está estudiado que a partir de 4,5 el contraste es suficiente
para identificar la figura y el fondo.
Y ustedes me dirán: ¿cómo yo hago para saber cuánto tiene
de ratio mi figura y mi fondo?
Pues muy bien.
Hay muchos sitios web como este que se llama "Contrast Ratio"
y muchos otros, ustedes pueden googlear,
que les van a decir de manera gratuita,
ustedes poniendo un código de color hexadecimal
o directamente sobre un círculo cromático,
el color que identifiquen como el que quieren utilizar,
qué contraste hay entre el fondo y la figura,
que puede ser texto.
Fíjense que en este ejemplo vamos a ver como en un sistema
de semáforo, pero también aportando el dato numérico,
cómo en rojo está 1,61, que es muy bajo ratio de contraste,
3,72, que es medio, no alcanza al 4,5,
y aquí cuando tenemos 8,2, ya nos está diciendo que estamos
en verde, que es correcto este número y que el contraste está muy bien.
Perfecto.
Aquí tenemos unos ejemplos de tipografía sobre fondos
de diferentes colores para ver cómo está el contraste.
Esto es de la fuente de Fundación ONCE.
También encontramos codificado, por eso dice evitar
la dependencia del color, codificado muchas veces solo a través del color.
Y entonces decimos cosas en nuestra verbalización
o en juegos, por ejemplo, que nosotros podamos ponerles
a nuestros estudiantes juegos de interacción.
Apretando el botón verde vas a encontrar la solución,
el escape está por tal lugar, el "escape room".
O selecciona tales íconos
para llegar a tal objetivo de color verde.
Entonces, solo hacemos referencias cromáticas.
Esto no es del todo pertinente,
digamos que no es pertinente.
Podemos utilizar el color, no es que no hay que utilizarlo,
pero agreguémosle siempre una información extra para tener
para tener un doble acceso o un triple acceso a la información
y que no se generen barreras de acceso a esa información, ¿verdad?
Podemos verlo en este ejemplo.
Aquí tenemos una torta de información
sin ningún otro dato más que el color.
Sin embargo, si yo le agrego a ese color la referencia,
por ejemplo, el texto, estoy dando un recurso
más de interpretación a las personas, ¿no?
Entonces, además del color, agrego texto.
Aquí tenemos otro ejemplo para evitar la dependencia del color.
Estas gráficas, ¿no?
Algún estudio con gráficas, estadísticas, lo que sea.
También solo a través del color y la forma.
Lo más apropiado sería agregarle a esto un patrón particular
para que sea doblemente interpretado y si la persona
tiene un problema de daltonismo o cualquier problema
de percepción del color, lo va a tener resuelto a través
de estos patrones y va a poder interpretar mi gráfica.
Miren este ejemplo que parece muy claro.
Aquí tenemos una gráfica con patrones que se superponen,
que tienen diferentes colores, que tiene el verde,
podría tener el rojo y diferentes colores
que tienen problemas las personas.
Pero fíjense que esta gráfica, si yo la paso a escala
de grises, no voy a tener problemas de interpretación.
Precisamente porque el patrón me está ayudando.
Muy bien.
El tema de la información redundante
que más o menos es lo que venimos tratando, ¿no?
Cómo hacer diferentes... y agregados de información
a un dato que yo estoy dando.
En vez de que sea una sola forma de ingresar a esa información,
ponerle dos o tres accesos a la información.
Por eso se dice información redundante.
En realidad son diferentes recursos para entrar a la información,
como venimos viendo.
Aquí tenemos un caso un poquito más complejo.
Yo tengo una imagen aquí realmente compleja para poder
interpretar la cuadrícula, los grises que quieren decir
diferentes cosas en el contexto de este libro.
Y aquí la persona, aquí el autor,
lo que ha hecho fue describir, explicar directamente
en el texto de párrafo lo que trae la imagen abajo.
Esto anticipa y también pone en situación al lector, ¿no?
Le va explicando qué va a ver en la gráfica, qué tiene que mirar.
También ya la persona con problemas visuales,
el lector de pantalla le anticipa que tiene la imagen.
Y, si bien nosotros podríamos reforzarla
con algún texto alternativo, no sería del todo necesario,
y esto tendríamos que evaluarlo en función de lo que describe
precisamente el texto de párrafo, ¿verdad?
Entonces, este es otro recurso más de información redundante.
Aquí les dejo un libro
de accesibilidad de descarga gratuita,
si quieren verlo y profundizar estos temas.
Por último, y si es posible, no es que sea obligatorio,
uno podría hacer una prueba con una tecnología asistida.
Ustedes saben que hay muchas tecnologías que ayudan
a las personas con discapacidades
a interpretar estas condiciones digitales.
Bueno, por ejemplo, los lectores de pantalla.
Si uno hace un testeo con un lector de pantalla y sale bien,
o sea, que el lector de pantalla interpreta bien ese texto,
podemos considerar que a priori o en principio
los diferentes software asistivos o tecnologías asistivas
van a interpretar bien esta información.
Con lo cual, yo podría hacer el testeo con uno de ellos.
Aquí les traje uno de ejemplo.
Este es un lector de pantalla NVDA que es de descarga gratuita,
es de uso gratuito y bastante sencillo de usar
en condiciones básicas, que pueden buscarlo en la web.
Escuchen con atención y vean cómo lee línea a línea
y cómo lee el texto alternativo
que está en la descripción interna de la imagen.
[El lector lee el texto y describe la imagen que aparece en el vídeo]
Importante, ¿no?
Importante hacer este testeo.
Una cosa más quiero agregarles.
Las imágenes en movimiento que muchas veces nos encanta agregar
en nuestras presentaciones.
Bien, hay que tener cuidado con esto para las personas que puedan tener
algún tipo de epilepsia fotosensitiva.
Si tenemos mucho tiempo esto puesto en pantalla, puede generar...
no es que siempre sea así, pero podría
generar algún tipo de este tipo de ataques.
Con lo cual, no es muy recomendado el uso.
De hecho, las imágenes animadas, los GIF,
se prefiere que no excedan
los 5 segundos de destello o de movimiento.
Además, porque son distractivas para las personas
con problemas cognitivos o con déficit de atención.
Bueno, esto fue todo muy rápido para dar un paneo general
sobre el tema de imágenes digitales accesibles.
Entonces, recuerden que tenemos que pensar en el texto alternativo
y que hay que ponerlo específicamente cuando sea significativo.
Los contrastes de colores y verificarlos en un validador online
sin ningún problema.
Evitar la dependencia del color y utilizar otros recursos,
además de la información a través del color.
Agregar información redundante para tener diferentes accesos
a esa información que la imagen nos quiere dar.
Y, si es posible, utilizar un lector de pantalla para hacer
algún testeo, siempre va a sumar
a la buena calidad de nuestros recursos.
Bueno, eso ha sido todo y espero que les haya interesado.
Agradezco muchísimo su atención.
[Música]